<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :formType="type" @formChange="formChangeHandle" :isSubmitBtn="false" :collapse="false" labelWidth="110" />

    <BreakSpace label="操作记录" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable ref="table" :isSelectColumn="false" height="auto" :columns="columns" :dataSource="tableList" :onColumnsChange="columns => (this.columns = columns)"> </FilterTable>

    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'center'
      }"
    >
      <el-button @click="closeDrawer">返 回</el-button>
    </div>
  </div>
</template>
<script>
import moment from 'moment';
import { dictionary } from '@/utils/dictMixin';
import { queryById, queryAuditLog } from '@/api/dealerSale/TestDrive/routineQuery';

export default {
  mixins: [dictionary],
  props: ['type', 'rowData'],

  data() {
    this.saveData = null;
    this.saveData1 = null;
    return {
      formList: this.createdFrom(),
      columns: this.createdTable(),
      tableList: [],
      formData: {}
    };
  },
  created() {
    this.init();
    this.queryAuditLog();
  },
  methods: {
    async init() {
      if (this.type != 'add') {
        const res = await queryById(this.rowData.id);
        if (res.resultCode == 200) {
          this.formList.map(x => {
            x.initialValue = res.data[x.fieldName];
          });
        }
      }
    },
    async queryAuditLog() {
      const res = await queryAuditLog(this.rowData.id);
      this.tableList = [];
      if (res.resultCode == 200) {
        this.tableList = res.data;
      }
    },
    setFormData(data) {
      for (let key in data) {
        this.formList.map(x => {
          if (x.fieldName == key) {
            x.initialValue = data[x.fieldName];
          }
        });
      }
    },
    formChangeHandle(val) {
      this.saveData = val;
    },

    closeDrawer() {
      this.$emit('close');
    },

    createdFrom() {
      return [
        {
          type: 'INPUT',
          label: '申请单号',
          fieldName: 'changeNo',
          placeholder: '',
          disabled: true
        },
        {
          type: 'SELECT',
          label: '申请状态',
          fieldName: 'applyStatus',
          placeholder: '',
          initialValue: 60831001,
          itemList: this.createDictList('6083'),
          disabled: true
        },
        {
          type: 'INPUT',
          label: 'VIN',
          fieldName: 'vin',
          placeholder: '',
          readonly: true,
          unitRender: () => {
            return <el-button slot="append" icon="el-icon-search" onClick={() => this.vinHandle()}></el-button>;
          }
        },
        {
          type: 'INPUT',
          label: '产品代码',
          fieldName: 'productCode',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '车系',
          fieldName: 'seriesName',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '车型',
          fieldName: 'modelName',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '配置',
          fieldName: 'packageName',
          placeholder: '',
          selfCols: 2,
          disabled: true
        },
        {
          type: 'INPUT',
          label: '内饰',
          fieldName: 'trimName',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '外饰',
          fieldName: 'colorName',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '行驶里程',
          fieldName: 'allMilliage',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '录入时间',
          fieldName: 'changeDate',
          placeholder: '',
          offsetRightCols: 1,
          disabled: true
        },
        {
          type: 'TEXT_AREA',
          label: '备注',
          fieldName: 'remark',
          selfCols: 3,
          placeholder: ''
        }
        // {
        //   type: 'TEXT_AREA',
        //   label: '审批意见',
        //   fieldName: 'checkRemark',
        //   selfCols: 3,
        //   placeholder: ''
        // }
      ];
    },

    createdTable() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          fixed: 'left',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '单据执行前状态',
          dataIndex: 'starStatus',
          filterType: 'checkbox',
          filterItems: this.createDictList('6083'),
          render: props => {
            return <span>{this.createDictText(props.row.starStatus, '6083')}</span>;
          }
        },
        {
          title: '单独执行后状态',
          dataIndex: 'returnStatus',
          filterType: 'checkbox',
          filterItems: this.createDictList('6083'),
          render: props => {
            return <span>{this.createDictText(props.row.returnStatus, '6083')}</span>;
          }
        },
        {
          title: '操作人员',
          dataIndex: 'createdByName'
        },
        {
          title: '操作时间',
          dataIndex: 'createdAt'
        },
        {
          title: '操作类型',
          dataIndex: 'returnStatus',
          filterType: 'checkbox',
          filterItems: this.createDictList('6083'),
          render: props => {
            return <span>{this.createDictText(props.row.returnStatus, '6083')}</span>;
          }
        },
        {
          title: '审批意见',
          dataIndex: 'remark'
        }
      ];
    }
  }
};
</script>
